<template>
  <div id="main_container">
    <el-container style="height: 100%; border: 1px solid #eee">
      <el-aside width="250px" style="background-color: rgb(238, 241, 246)">
        <el-menu :default-openeds="['2','3','4','5']">
          <router-link to="/welcome">
            <el-menu-item index="1">
              <i class="el-icon-s-home"></i>
              <span slot="title">首页</span>
            </el-menu-item>
          </router-link>
          <el-submenu index="2">
            <template slot="title"><i class="el-icon-menu"></i>tensorflow案例</template>
            <el-menu-item-group>
              <router-link to="/dog_vs_cat">
                <el-menu-item index="1-1">猫狗分类</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="3">
            <template slot="title"><i class="el-icon-message"></i>项目实战</template>
            <el-menu-item-group>
              <router-link to="/Practice">
                <el-menu-item index="3-1">自定模型</el-menu-item>
              </router-link>
              <router-link to="/modeleva">
                <el-menu-item index="3-3">模型测试</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="4">
            <template slot="title"><i class="el-icon-setting"></i>学生信息</template>
            <el-menu-item-group>
              <router-link to="/userinfo">
                <el-menu-item index="4-1">个人资料</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="5">
            <template slot="title"><i class="el-icon-collection"></i>学习手册</template>
            <el-menu-item-group>
              <router-link to="/help">
                <el-menu-item index="5-1">参考资料</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
        </el-menu>
      </el-aside>
      <el-container>
        <el-main>
           <router-view />
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>


export default {
  name: "main",

}

</script>

<style scoped>
a{
  text-decoration: none;
}

.router-link-active {
  text-decoration: none;
}

#main_container{
  height: 100%;
}

.el-container { height: 100%; }
.el-header, .el-footer { background-color: #b3c0d1; color: #333; text-align: center; line-height: 60px; }
.el-aside {
  background-color: #d3dce6;
  color: #333; text-align: center;
  line-height: 200px;
  display: block;
  position: relative;
  bottom: 0;
}
.el-main {
  background-color: #E4E7ED;
  color: #333; text-align: center;
}
.el-menu { background-color: #d3dce6; }

</style>
